<template>
	<common-card class="portal_notice_wrapper">
		<div class="item">
			<a-link href="link" :hoverable="false">假期生活服务保障安排</a-link>
			<span>01-10</span>
		</div>
		<div class="item">
			<a-link href="link" :hoverable="false">学院组织假期观影活动</a-link>
			<span>01-10</span>
		</div>
		<div class="item">
			<a-link href="link" :hoverable="false">关于推荐2022年全国科普作品</a-link>
			<span>01-10</span>
		</div>
		<div class="item">
			<a-link href="link" :hoverable="false">关于认真组织学习《习近平经济思想学习纲要》</a-link>
			<span>01-10</span>
		</div>
		<div class="item">
			<a-link href="link" :hoverable="false">关于组织学员年度比武竞赛通知</a-link>
			<span>01-10</span>
		</div>
		<div class="item">
			<a-link href="link" :hoverable="false">关于组织开展科技素养的通知</a-link>
			<span>01-10</span>
		</div>
		<div class="item">
			<a-link href="link" :hoverable="false">关于组织开展安全教育的通知</a-link>
			<span>01-10</span>
		</div>
		<div class="item">
			<a-link href="link" :hoverable="false">假期生活服务保障安排</a-link>
			<span>01-10</span>
		</div>
		<!-- <div class="item">
			<a-link href="link" :hoverable="false">学院组织假期观影活动</a-link>
			<span>01-10</span>
		</div> -->
	</common-card>
</template>

<script lang="ts" setup>
import commonCard from '../commonCard.vue';
defineOptions({ name: 'Notice' });
</script>

<style lang="scss" scoped>
.portal_notice_wrapper {
	&:deep(.arco-card-body) {
		flex-direction: column;
		padding: 10px 16px !important;
	}
	.item {
		display: flex;
		align-items: center;
		justify-content: space-between;
		min-height: 36px;
		max-height: 40px;
		flex: 1;
		span {
			color: #999;
			flex-shrink: 0;
			line-height: 1;
			margin-left: 8px;
			user-select: none;
		}
	}
	.arco-link {
		color: #303133;
		line-height: 1;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		&:hover {
			color: rgb(var(--link-6));
			text-decoration: underline;
		}
	}
}
</style>
